<template>
	<view>
		<view class="usearch">
			<u-search @custom="onsearch" v-model="content" clearabled="true" borderColor="#ddd"></u-search>
		</view>
		<view v-if="historysearch">
			<view class="history">
				<text>常用搜索</text>
			</view>
			<view class="history_record">
				<text @click="bnt1"  style="color: #2979FF;">{{title[0].name}}</text>
				<text @click="bnt2"  style="margin-left: 30rpx;color: #2979FF;">{{title[2].name}}</text>
				<text @click="bnt3"  style="margin-left: 30rpx;color: #2979FF;">{{title[1].name}}</text>
			</view>
			
		</view>
		<view  v-if="listchat"@click="enter">
			<view class="item">
				<view>
					<u-image :src="title[showindex].src" shape="circle" height="150rpx" width="150rpx"></u-image>
				</view>
				<view class="fontt">
					<view >
						<text class="fontsize">{{title[showindex].name}}</text>
						<text class="fonttime">{{title[showindex].time}}</text>
					</view>
					<view class="underfontsize">
						<text class="underfont">{{title[showindex].content}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				content:'',
				listchat:false,
				title:'',
				showindex:'',
				historysearch:true
			}
		},
		onLoad(){
			
			this.title=getApp().globalData.titleChatApp;
		},
		methods:{
			onsearch:function(){
				// console.log(this.content);
				var flag=0;
				for(var i=0;i<this.title.length;i++){
					if(this.content==this.title[i].name){
						this.showindex=i;
						this.listchat=true;
						console.log('showindex'+this.showindex);
						flag=1;
						break;
					}
				}
				if(flag==0){
					wx.showToast({
						title:'未找到',
						icon:'error',
						duration:2000
					})
				}
				this.content='';
			},
			enter:function(){
				uni.navigateTo({
					url:'../mesChat/mesChat'
				})
			},
			bnt1:function(){
				this.showindex=0;
				this.historysearch=false;
				this.listchat=true;
			},
			bnt2:function(){
				this.showindex=1;
				this.historysearch=false;
				this.listchat=true;
			},
			bnt3:function(){
				this.showindex=2;
				this.historysearch=false;
				this.listchat=true;
			}
		}
		
	}
</script>

<style>
	
	.usearch{
		margin: 10rpx;
	}
	.item{
		height:170rpx;
		display: flex;
		flex-direction: row;
		border-bottom: solid 1px #ddd;
		margin-top: 10rpx;
	}
	.fontt{
		margin-top: 20rpx;
		margin-left: 10rpx;
		display:flex;
		flex-direction: column;
	}
	.fontsize{
		margin-top: 600rpx;
		font-size: 40rpx;
	}
	.underfontsize{
		margin-top: 20rpx;
		margin-left: 10rpx;
	}
	.underfont{
		font-size: 33rpx;
		color: #909193;
	}
	.fonttime{
		position:fixed;
		left:600rpx;
		margin-top: 20rpx;
		color: #909193;
	}
	.history{
		margin:20rpx;
		font-size: 35rpx;
	}
	.history_record{
		margin:20rpx;
		font-size: 25rpx;
	}
</style>
